<template>
    <view class="container" :style="themeColor">
        <view class="card-group">
            <card-group-cell
                label="个人信息"
                @click.native="easyGoTo('/pages_me/packet/setting/profile')"></card-group-cell>
            <!-- <card-group-cell label="绑定微信" ></card-group-cell> -->
        </view>
        <view class="card-group">
            <card-group-cell
                label="登录密码设置"
                @click.native="easyGoTo('/pages_me/packet/setting/changePwd')"></card-group-cell>
            <card-group-cell
                label="交易密码设置"
                @click.native="easyGoTo('/pages_me/packet/setting/changeDealPwd')"></card-group-cell>
        </view>
        <!-- #ifdef APP -->
        <view class="card-group">
            <card-group-cell label="检查版本" :value="getVersion()" @click.native="checkVersion"> </card-group-cell>
        </view>
        <!-- #endif -->
        <view class="card-group">
            <card-group-cell
                label="收获地址"
                @click.native="easyGoTo('/pages_me/packet/address/index')"></card-group-cell>
            <card-group-cell
                label="开票信息"
                v-if="openInvoice"
                @click.native="easyGoTo('/pages_me/packet/billing/index')"></card-group-cell>
            <card-group-cell label="子账号管理"></card-group-cell>
            <card-group-cell label="清除缓存" @click.native="clearCache"></card-group-cell>
            <card-group-cell label="切换身份" @click.native="cutAccountFn"></card-group-cell>
        </view>
        <button class="btn btn-success" @click="logout">退出登录</button>

        <uni-popup ref="popLogout" type="bottom" background-color="#fff" :safe-area="false">
            <view class="bottom-pop">
                <text class="title">确认退出当前账户?</text>
                <view class="actions">
                    <button class="btn btn-gray" @click="cancelLogout">取消</button>
                    <button class="btn btn-danger-hollow" @click="doLogout">退出</button>
                </view>
            </view>
        </uni-popup>
        <pop-check-cut ref="popCheckCut" :datas="cutList" @selected="selected"></pop-check-cut>

        <app-version ref="appVersion" :isAutoCheck="false" :appId="getAppId()"></app-version>
    </view>
</template>

<script>
import { mapMutations, mapState } from "vuex"
import { GetMemberDetail, GetUserLoginList, SwitchUserLogin } from "@/service/api/member.js"
import { uploadImage } from "@/service/api/file.js"
import cardGroupCell from "@/components/common/cell/card-group-cell.vue"
import storage from "@/uni-sub-base/utils/storage.js"
import appVersion from "@/uni-sub-base/module/version/app-version.vue"
import popCheckCut from "@/components/cutAccount/cut-account.vue"
import { getUserInfo, getProductDisplay } from "@/utils/appInit.js"
import { getUserCarList } from "@/utils/cartUtil.js"
import { GetIsOpenInvoice } from "@/service/api/order.js"
export default {
    components: {
        cardGroupCell,
        appVersion,
        popCheckCut,
    },
    data() {
        return {
            cutList: [],
            userInfo: {},
            openInvoice: false,
        }
    },
    mounted() {},
    onLoad() {
        this.GetUserLoginList()
        this.getIsOpenInvoice()
    },
    methods: {
        ...mapMutations(["SET_AUTH"]),
        // 获取身份列表
        GetUserLoginList() {
            this.userInfo = storage.getCache("userInfo")
            let path = "?userId=" + this.userInfo.UserId
            GetUserLoginList(path).then((res) => {
                if (res.State == 1) {
                    res.Data.shift()
                    this.cutList = res.Data
                }
            })
        },
        getIsOpenInvoice() {
            GetIsOpenInvoice().then((res) => {
                if (res.State == 1) {
                    this.openInvoice = res.Data == 1 ? true : false
                }
            })
        },
        //打开切换
        cutAccountFn() {
            this.$refs.popCheckCut.openPop()
        },
        selected(item) {
            this.loginByAccount(item)
        },
        loginByAccount(item) {
            uni.showLoading({
                title: "切换中",
            })
            let path = "?userId=" + item.UserId
            SwitchUserLogin(path).then((res) => {
                if (res.State == 1 && res.Data) {
                    this.goHome(res.Data.Token)
                } else {
                    uni.hideLoading()
                    this.easyToast(res.Msg)
                }
            })
        },
        goHome(token) {
            this.SET_AUTH(token)
            setTimeout((e) => {
                this.getUserInfo()
            }, 2500)
            getUserCarList()
            getProductDisplay().then((res) => {})
        },
        getUserInfo() {
            let url = "/pages/index/index"
            getUserInfo().then((res) => {
                uni.hideLoading()
                uni.reLaunch({
                    url: url,
                })
            })
        },
        //退出登录
        logout() {
            this.$refs.popLogout.open()
        },
        //退出登录
        cancelLogout() {
            this.closePop()
        },
        //退出登录
        doLogout() {
            this.closePop()
            storage.removeCache("token")
            storage.removeCache("userInfo")
            storage.removeCache("productDisplay")
            uni.reLaunch({
                url: "/pages/login/shop-login",
            })
        },
        //关闭提示弹窗
        closePop() {
            this.$refs.popLogout.close()
        },
        getVersion() {
            //#ifdef APP-PLUS
            let ver = plus.runtime.version

            return ver
            //#endif
            return ""
        },
        checkVersion() {
            this.$refs.appVersion.checkVersion()
        },
    },
}
</script>

<style lang="scss">
.container {
    padding: $app-page-padding;
    .card-group-cell .image {
        width: 90rpx;
        height: 90rpx;
        border-radius: 90rpx;
    }
    .card-group-cell {
        .uni-icons {
            color: #ccc;
        }
        text,
        .label,
        .input {
            font-size: 28rpx;
        }
    }
}
.card-group {
    margin-bottom: 20rpx;
    background: $color-white;
    border-radius: $border-radius-10;
}
.btn {
    margin-top: 40rpx;
    height: 88rpx;
    font-size: 36rpx;
}
.bottom-pop {
    background: $color-white;
    padding: $app-page-padding;
    border-radius: $border-radius-30 $border-radius-30 0 0;

    .title {
        margin-top: 20rpx;
        display: flex;
        justify-content: center;
        margin-bottom: 20rpx;
        font-size: $font-size-28;
        font-weight: 600;
    }
    .actions {
        display: flex;
        flex-direction: row;
        margin-bottom: 48rpx;
        .btn {
            width: 220rpx;
        }
    }
}
</style>
